<#include "../../select.ftl" />
<div class="modal-dialog wide" style="width: 750px;">
    <div class="modal-content">
        <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title" id="myModalLabel">选择主管</h4>
        </div>
        <div class="modal-body">
            <!-- row -->
            <div class="row">
                <div class="col-md-5">
                    <div class="table-responsive" id="orgContent">
                        <div class="tile-body" style="height: 450px; overflow-y: auto">
                            <div class="dd" id="nestable3">
                            <#if organization??>
                                <ol class="dd-list">
                                    <li class="dd-item dd3-item dd-field dd-active" data-id="5">
                                        <div class="dd3-content">${organization.orgName!''}
                                            <input type="hidden" name="orgId" value="${organization.orgId!''}"/>
                                        </div>
                                        <#if orgList??>
                                            <#list orgList as org>
                                                <ol class="dd-list">
                                                    <#if usingOrgId?? && usingOrgId == org.orgId!''>
                                                    <li class="dd-item dd3-item dd-field dd-active" data-id="5">
                                                    <#else>
                                                    <li class="dd-item dd3-item dd-field" data-id="5">
                                                    </#if>
                                                    <div class="dd3-content">${org.orgName!''}
                                                        <input type="text" name="orgId"
                                                               value="${org.orgId!''}"/>
                                                    </div>
                                                    <#if org.childrenOrgList??>
                                                        <#assign orgList=org.childrenOrgList/>
                                                        <#include "childerOrg.ftl"/>
                                                    </#if>
                                                </li>
                                                </ol>
                                            </#list>
                                        </#if>
                                    </li>
                                </ol>
                            <#else>
                                <#if orgList??>
                                    <#list orgList as org>
                                        <ol class="dd-list">
                                            <li class="dd-item dd3-item dd-field" data-id="5">
                                                <div class="dd3-content">${org.orgName!''}
                                                    <input type="hidden" name="orgId" value="${org.orgId!''}"/>
                                                </div>
                                                <#if org.childrenOrgList??>
                                                    <#assign orgList=org.childrenOrgList/>
                                                    <#include "childerOrg.ftl"/>
                                                </#if>
                                            </li>
                                        </ol>
                                    </#list>
                                </#if>
                            </#if>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-md-7">
                    <section class="tile">
                        <!-- tile body -->
                        <div class="tile-body">
                            <div id="showMessage"><#include "../../message.ftl" /></div>
                            <div class="form-horizontal">
                                <form id="search_user_select"
                                      action="${absoluteContextPath}/system/user/ajaxSelectOSList"
                                      method="post">
                                    <input type="hidden" name="pageSize" value="${usersTable.page.pageSize}"/>
                                    <input type="hidden" name="currentPage" value="${usersTable.page.currentPage}"/>
                                    <input type="hidden" name="status" value="${userParams.status!''}"/>
                                    <input type="hidden" name="roleId" value="${userParams.roleId!''}"/>
                                    <input type="hidden" name="orgId" value="${userParams.orgId!''}"/>

                                    <div class="row">

                                        <div class="form-group col-md-8">
                                            <label class="col-sm-5 control-label" for="exampleInputEmail2">用户名称</label>

                                            <div class="col-sm-7">
                                                <input class="form-control" name="userName"
                                                       value="${userParams.userName!''}" placeholder="" type="text">
                                            </div>
                                        </div>
                                        <div class="form-group col-md-4">
                                            <button type="button" class="btn btn-primary" onclick="refreshUserTable()">
                                                查询
                                            </button>
                                            <button type="reset" class="btn btn-default">重置</button>

                                        </div>
                                </form>
                            </div>
                        </div>
                    </section>
                    <section class="tile">
                        <div class="tile-body nopadding">
                            <div class="table-responsive" id="selectContent">
                            <#--<#include "selectUserTable.ftl"/>-->
                            </div>
                        </div>
                    </section>
                </div>
            </div>
        </div>
        <div class="modal-footer">
            <button type="button" class="btn btn-default" data-dismiss="modal" aria-hidden="true">取消</button>
            <button id="confirm" type="button" class="btn btn-primary">确定</button>
        </div>
    </div>
</div>

<script>
    $(function () {
        var updateOutput = function (e) {
            var list = e.length ? e : $(e.target);
            output = list.data('output');
            if (window.JSON) {
                $(output).val(window.JSON.stringify(list.nestable('serialize')));//, null, 2));
            } else {
                output.val('JSON browser support required for this demo.');
            }
        };
        $('#nestable3').nestable({
            group: 1
        }).on('change', updateOutput);
        $('.dd3-content .dropdown-menu input').click(function (e) {
            e.preventDefault();
            e.stopPropagation();
        });

        $(".dd-list li").click(function (e) {
            if ($(e.target).attr("class") != "dd3-content") {
                return;
            }
            if ($(this).attr("class").indexOf('dd-active') > 0) {
                $(".dd-list li").each(function () {
                    $(this).removeClass("dd-active");
                    $(this).find("li").removeClass("dd-active");
                });
            } else {
                $(".dd-list li").each(function () {
                    $(this).removeClass("dd-active");
                    $(this).find("li").removeClass("dd-active");
                });
                $(this).addClass("dd-active");
            }
            e.preventDefault();
            e.stopPropagation();
            var orgId = $(this).find("input[name=orgId]").val();
            orgSelectUser(orgId);
        });
    });

    function orgSelectUser(orgId) {
        var data = {};
        $("#search_user_select input[name=orgId]").val(orgId);
        $("#search_user_select").ajaxSubmit({
            url: '${absoluteContextPath}/system/user/ajaxSelectOSList',
            data: data,
            success: function (data) {
                var data = JSON.parse(data);
                if (data.returnCode == 1) {
                    $("#selectContent").html(data.content.data);
                } else {
                    $.showMessage({parentId: "showMessage", message: "表格数据加载异常！", type: "success"});
                }
            }
        });
    }

    function refreshUserTable() {
        $("#search_user_select").ajaxSubmit({
            url: '${absoluteContextPath}/system/user/ajaxSelectOSList',
            success: function (data) {
                var data = JSON.parse(data);
                if (data.returnCode == 1) {
                    $("#selectContent").html(data.content.data);
                } else {
                    $.showMessage({parentId: "showMessage", message: "表格数据加载异常！", type: "success"});
                }
            }
        });
    }
</script>